<template>
    <el-dialog
            :visible.sync="dialogVisible"
            width="400px"
            :before-close="closeDialog"
            append-to-body
            title="保存流程"
    >
    
    
        <el-form  :label-position="labelPosition"  label-width="70px" ref="form" :model="form"  v-loading="loading">
             <el-form-item prop="processCode" label="流程编码">
                <el-input size= "small" type="text" :disabled="editProcessCode" placeholder="请输入流程编码"  v-model="form.processCode"></el-input>
            </el-form-item>

             <el-form-item prop="processName" label="流程名称">
                <el-input size= "small" type="text"  placeholder="请输入流程名称"  v-model="form.processName"></el-input>
            </el-form-item>
            <el-form-item prop="processVersion" label="流程版本">
                <el-input size= "small" type="text"  placeholder="请输入流程版本"  v-model="form.processVersion"></el-input>
            </el-form-item>

             <el-form-item prop="system" label="系统">
               <el-select v-model="form.system" placeholder="请选择系统"  size= "small">
                 <el-option
                     v-for="item in systemList"
                     :key="item.systemCode"
                     :label="item.systemName"
                     :value="item.systemCode">
                 </el-option>
               </el-select>
             </el-form-item>
            
             <el-form-item prop="module" label="系统模块">
                <el-input size= "small" type="text" placeholder="请输入系统模块"  v-model="form.module"></el-input>
            </el-form-item>

            <el-form-item prop="sysPath" label="系统路径">
              <el-input size= "small" type="text" placeholder="请输入系统路径"  v-model="form.sysPath"></el-input>
            </el-form-item>


        </el-form>
        <div class="btn-group">
            <el-button type="text" size="small" plain @click="closeDialog">取消</el-button>
            <el-button type="primary"  size="small" :disabled="loading" @click="submit" :loading="saveLoading">确定</el-button>
        </div>
    </el-dialog>
</template>

<script>

import {querySystem} from '@/api/resource'
    export default {
        data(){
            return {
                labelPosition:'right',
                dialogVisible: false,
                loading: false,
                form: {
                    processCode:"",
                    processName:"",
                    system:"",
                    module:"",
                    processVersion: "",
                    sysPath:""
                },
                editProcessCode:false,
                queryParams:{
                  pageNum:1,
                  pageSize:10000,
                  systemName:""
                },
                systemList:[],
                saveLoading:false
            }
        },
        created(){
          this.querySystemList();
        },
        methods:{
            async querySystemList(){
                let ret = await querySystem(this.queryParams);
                let content = ret.data;
                this.systemList = content.list;
            },
            showDialog(row){
                this.dialogVisible = true
                this.form = row;
                if(this.form.processId != null && this.form.processId !== ""){
                  this.editProcessCode = true;
                  this.changeVersionFlag = false;
                }
            },
            closeDialog(){
                this.form = {}
                this.dialogVisible = false
                this.loading = false
            },

            submit(){
              this.$emit('success',this.form)
              this.closeDialog()
            }
        }
    }
</script>
<style lang="scss" scoped>
    .btn-group{
        display: flex;
        justify-content: right;
        .el-button{
            width: 50px;
        }
    }
    .el-form-item{
        height: 40px;
    }
</style>